import * as dat from '../libs/dat.gui.module.js';

export default class Panel {
  constructor({ ldmaxPaticle }) {
    this.ldmaxPaticle = ldmaxPaticle;
    this.maxParticles = 15000;
    this.particleHeight = 100;
    this.fadeOpacity = 0.9;
    this.dropRate = 0.1;
    this.dropRateBump = 0.01;
    this.speedFactor = 1;
    this.lineWidth = 3;

    this.globeLayer = { name: 'NaturalEarthII', type: 'NaturalEarthII' };
    this.WMS_URL = 'https://dev.virtualearth.net';
    this.layerToShow = 'NaturalEarthII';

    var onParticleSystemOptionsChange = function () {
      var event = new CustomEvent('particleSystemOptionsChanged');
      window.dispatchEvent(event);
    };

    const that = this;

    /* window.onload = function () { */
    var gui = new dat.GUI({ autoPlace: false });
    // @ts-ignore
    // prettier-ignore
    gui.add(that, 'maxParticles', 1, that.ldmaxPaticle, 1)
      .onFinishChange(onParticleSystemOptionsChange);
    // @ts-ignore
    //gui.add(that, 'dropRate', 0.1, 0.1).onFinishChange(onParticleSystemOptionsChange);
    // @ts-ignore
    gui.add(that, 'dropRateBump', 0, 0.2).onFinishChange(onParticleSystemOptionsChange);
    // @ts-ignore
    gui.add(that, 'speedFactor', 0.05, 8).onFinishChange(onParticleSystemOptionsChange);
    // @ts-ignore
    gui.add(that, 'lineWidth', 0.01, 16.0).onFinishChange(onParticleSystemOptionsChange);

    /* gui.add(that, 'particleHeight', 1, 10000, 1).onFinishChange(onParticleSystemOptionsChange);
    gui.add(that, 'fadeOpacity', 0.90, 0.999, 0.001).onFinishChange(onParticleSystemOptionsChange);
    gui.add(that, 'dropRate', 0.0, 0.1).onFinishChange(onParticleSystemOptionsChange);
    gui.add(that, 'dropRateBump', 0, 0.2).onFinishChange(onParticleSystemOptionsChange);
    gui.add(that, 'speedFactor', 0.05, 8).onFinishChange(onParticleSystemOptionsChange);
    gui.add(that, 'lineWidth', 0.01, 16.0).onFinishChange(onParticleSystemOptionsChange);
*/
    var panelContainer = document.getElementsByClassName('cesium-widget').item(0);
    gui.domElement.classList.add('myPanel');
    panelContainer.appendChild(gui.domElement);
    /* }; */
  }

  getUserInput() {
    // 确保 maxParticles 是一个完全平方数，即开根号后必须是正整数
    var particlesTextureSize = Math.ceil(Math.sqrt(this.maxParticles));
    this.maxParticles = particlesTextureSize * particlesTextureSize;

    return {
      particlesTextureSize: particlesTextureSize,
      maxParticles: this.maxParticles,
      particleHeight: this.particleHeight,
      fadeOpacity: this.fadeOpacity,
      dropRate: this.dropRate,
      dropRateBump: this.dropRateBump,
      speedFactor: this.speedFactor,
      lineWidth: this.lineWidth,
      globeLayer: this.globeLayer,
      WMS_URL: this.WMS_URL
    };
  }
}
